<template>
    <div id="upload_img">
        <div class="ant cur">
		    <div class="uploadPos"  @click="e_uploadant">
                <img class="uploadAntImg" ref="antImg" src="./addImg.png" alt="">
            </div>
        </div>
 	<input @change="antchange($event)" type="file" id="antimg" class="hidden" ref="antimg">
</div>
    
</template>
<script>
export default {
	name: 'uploadImg',
	data() {
		return {}
	},
	methods: {
		e_uploadant() {
			document.getElementById('antimg').click()
		},
		// 监听身份证反面上传
		antchange(el) {
			let target = el.target
			this.antUrl = el.target.files[0]
            this.$refs.antImg.src = this.getFileUrl(el.srcElement)
            this.$emit('file_img',this.antUrl)
		},
		getFileUrl(obj) {
			let url
			url = window.URL.createObjectURL(obj.files.item(0))
			return url
		},
	},
}
</script>
<style>
upload_img {
	width: 100%;
	height: 40px;
}
.ant {
	width: 100%;
	height: 100%;
	background-color: #1e2235;
	text-align: center;
	line-height: 60px;
	color: #c7cce6;
	border: 1px dashed #c7cce6;
}

.uploadAntImg {
	width: 100%;
	height: 100%;
}
.delete {
	width: 20px;
	height: 20px;
	background-color: #7a98f7;
	position: absolute;
	right: 0;
	background: #fff;
	opacity: 0.6;
}
.antmask {
	background: #fff;
}
.hidden {
	display: none;
}
.selecrcode {
	color: #4d5680;
	font-size: 12px;
}
</style>

